import React from 'react';
import ReactDOM from 'react-dom';
import 'antd/dist/antd.css';
import './index.css';
import {Divider, ConfigProvider} from 'antd';
import zhCN from 'antd/lib/locale/zh_CN';
import 'moment/locale/zh-cn';
import moment from 'moment';
import Topic1 from "./Topic1";
import Topic2_1 from "./Topic2_1";
import Topic2_2 from "./Topic2_2";
import Topic3 from "./Topic3";

moment.locale('zh-cn');

const setCode = () => {
  return {
    html: '<pre>\n' +
      '      getHighestFreqChar(s) {\n' +
      '      if (value) {\n' +
      '      if (value.search(/(.+)(?=.*\\1.*)/) < 0) return \'\'\n' +
      '      const newValue = value.split(\'\')\n' +
      '      // 过滤重复项\n' +
      '      var notRepeat = newValue.filter((item, index, self) => self.indexOf(item) === index);\n' +
      '      const result = [];\n' +
      '\n' +
      '      // 所有重复元素添加进新数组内\n' +
      '      notRepeat.forEach((item, i) => {\n' +
      '      const t = newValue.filter(x => x === item);\n' +
      '      if (t.length > 1) {\n' +
      '      result.push({len: t.length, key: item});\n' +
      '    }\n' +
      '    });\n' +
      '      result.sort((a, b) => b.len - a.len)\n' +
      '      if (result.length === 1) {\n' +
      '      return result[0].key\n' +
      '    }\n' +
      '      // 设置符合条件value值\n' +
      '      if (result.length > 1) {\n' +
      '      if (result[0].len === result[1].len) {\n' +
      '      return result[1].key\n' +
      '    }\n' +
      '      return result[0].key\n' +
      '    }\n' +
      '    }\n' +
      '    }\n' +
      '    </pre>'
  }
}
ReactDOM.render(
  <ConfigProvider locale={zhCN}>

    <Divider orientation="left">题目1</Divider>
    <p>1) 每点击 bottomLeft 按钮一次，下拉菜单条目增加一项。选项的文字依次为 1st menu item, 2nd menu item, 3rd menu item, 4th menu item
      ……（注意数字后的表达式不同）</p>
    <p> 2) 在下拉菜单右侧增加一个 div 显示 所有选项中数字的和（1+2+3+……），div高度为 60px, 与bottomLeft按钮居中对齐</p>
    <Topic1/>
    <Divider orientation="left">题目2-1</Divider>
    <p>1）使用antd 组件实现以下表格，需满足图片中的特性</p>
    <p>
      a.有跳转链接
      b.有按钮，可以编辑、删除该行数据
      c.描述中需要显示换行
    </p>
    <Topic2_1/>
    <Divider orientation="left">题目2-2</Divider>
    <p>2）构造模拟数据，实现以下嵌套表格</p>
    <Topic2_2/>
    <Divider orientation="left">题目3</Divider>
    <p>输入一个字符串，返回字符串中出现次数最多的那个字符。如果有多个字符出现的次数相同，返回从左到右第二个出现的字符。
      Ex: 输入 aaaaab 返回 a
      Ex: 输入 aabbcc 返回 b
    </p>
    <Topic3/>
  </ConfigProvider>,
  document.getElementById('container'),
);
